<template>
	<view class="bottom-btn ">
		<view class="start justify-center align-center" @click="onClick" 
		:style="{bottom:getSafeBottom?(getSafeBottom+'px'):'30rpx'}"
		>
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		name: "bottom-btn",
		props: {
			
			money: {
				type: String,
				default: '0'
			},
		},
		data() {
			return {

			};
		},
		computed:{
			getSafeBottom(){
				return this.safebottom
			}
		},
		methods: {
			onClick() {
				this.$emit('onClick')
			}
		}
	}
</script>
<style>
	@import '/pages/home/common.css';
</style>
<style lang="scss">
	.bottom-btn {
		// // padding-bottom: calc(30rpx + constant(safe-area-inset-bottom));
		// // padding-bottom: calc(30rpx + env(safe-area-inset-bottom));
		
		

		.start {
			width: 670rpx;
			height: 90rpx;
			background: #CC1D1D;
			border-radius: 10rpx 10rpx 10rpx 10rpx;
			font-family: Source Han Sans SC, Source Han Sans SC;
			font-weight: 400;
			font-size: 36rpx;
			color: #FFFFFF;
			position: fixed;
			left: 50%;
			z-index: 1;
			transform: translate(-50%,0);
			bottom: var(--safe-area-inset-bottom);
		}

	}
</style>